layui.use(['element','layer'], function () {
   var element = layui.element
       ,$ = layui.jquery
       ,layer = layui.layer;

   //页面加载完毕
   $(document).ready(function () {
      var menu = '<li class="layui-nav-item layui-this"><a data-id="console" data-href="../page/console.html"><i class="layui-icon layui-icon-home"></i><cite>控制台</cite></a></li>\n' +
          '            <li class="layui-nav-item">\n' +
          '                <a><i class="layui-icon layui-icon-user"></i><cite>用户管理</cite></a>\n' +
          '                <dl class="layui-nav-child">\n' +
          '                    <dd><a data-id="user" data-href="../view/user.html">普通用户</a></dd>\n' +
          '                    <dd><a data-id="master" data-href="../view/master.html">代理站长</a></dd>\n' +
          '                    <dd><a data-id="admin" data-href="../view/admin.html">管理员</a></dd>\n' +
          '                </dl>\n' +
          '            </li>\n' +
          '            <li class="layui-nav-item">\n' +
          '                <a><i class="layui-icon layui-icon-table"></i><cite>数据管理</cite></a>\n' +
          '                <dl class="layui-nav-child">\n' +
          '                    <dd><a data-id="goods" data-href="../page/goods.html">商品管理</a></dd>\n' +
          '                    <dd><a data-id="type" data-href="../page/type.html">分类管理</a></dd>\n' +
          '                    <dd><a data-id="brand" data-href="../page/brand.html">品牌管理</a></dd>\n' +
          '                    <dd><a data-id="collect" data-href="../page/collect.html">商品采集</a></dd>\n' +
          '                </dl>\n' +
          '            </li>';
      $('.hirsi .layui-side ul').append(menu);

      element.init();
      element.tabAdd('hirsi-tabs', {
         title: '<i class="layui-icon layui-icon-home"></i>'
         ,content: '<iframe frameborder="0" name="console" class="hirsi-iframe"></iframe>' +
             '<form id="console" target="console" method="post" action="../view/console.html"></form>'
         ,id: 'console'
      });
      $('form#console').submit();
      element.tabChange('hirsi-tabs', 'console');

      setTimeout(function () {
         $('.loadding').addClass('layui-anim-fadeout');
         $('.hirsi').addClass('layui-anim-fadein');
         $('.loadding').attr('hidden', true);
      }, 2000);
   });

   //顶部header点击事件绑定
   $('.hirsi .layui-header ul li a').on('click', function () {
      var event = $(this).data('event');
      header_actice[event] ? header_actice[event].call(this) : '';
   });
   var header_actice = {
      shrink: function () {
         $(this).data('event','spread');
         $(this).find('i').removeClass('layui-icon-shrink-right').addClass('layui-icon-spread-left');
         $('.hirsi').addClass('hirsi-shrink');
      },
      spread: function () {
         $(this).data('event','shrink');
         $(this).find('i').removeClass('layui-icon-spread-left').addClass('layui-icon-shrink-right');
         $('.hirsi').removeClass('hirsi-shrink');
      }
   }

   //左侧导航事件绑定
   $('.hirsi .layui-side ul li a').on('click', function () {
      var isParent = $(this).parent().find('dl.layui-nav-child').length;
      if (isParent > 0){
         if ($('.hirsi').hasClass('hirsi-shrink')) {
            $('.hirsi .layui-header ul li a').click();
         }
      } else {
         if ($('.hirsi .layui-body .layui-tab ul li[lay-id = '+$(this).data('id')+']').length == 0){
            element.tabAdd('hirsi-tabs', {
               title: $(this).text()
               ,content: '<iframe frameborder="0" name="'+$(this).data("id")+'" class="hirsi-iframe"></iframe>' +
                         '<form id="'+$(this).data("id")+'" target="'+$(this).data("id")+'" method="post" action="'+$(this).data("href")+'"></form>'
               ,id: $(this).data('id')
            });
         }
         $('form#' + $(this).data("id")).submit();
         element.tabChange('hirsi-tabs', $(this).data('id')); //切换到：用户管理
      }
   });
   //监听选项卡的切换
   element.on('tab(hirsi-tabs)', function(){
      $('.hirsi .layui-side ul').find('.layui-this').removeClass('layui-this');
      $('.hirsi .layui-side ul a[data-id = '+$(this).attr('lay-id')+']').parent().addClass('layui-this');
   });
});